/**
 * context 测试
 */

import React, { createContext, useContext, useState } from 'react'

const contextValue = createContext(1)

const Aaa = function Aaa() {
  // let [_count, setCount] = useState(0)
  // let change = function change() {
  //   setCount(_count + 1)
  // }
  let count = useContext(contextValue)
  return <div>
    {/* <button onClick={change}>修改context值</button>
    <contextValue.Provider value={_count}>
      <Bbb></Bbb>
    </contextValue.Provider> */}
    Aaa 值: {count}
    <Bbb></Bbb>
  </div>
}

const Bbb = function Bbb() {
  let [_count, setCount] = useState(0)
  let change = function change() {
    setCount(_count + 1)
  }
  return <div>
    <button onClick={change}>修改context值</button>
    <contextValue.Provider value={_count}>
      <Ccc></Ccc>
    </contextValue.Provider>
  </div>
}

const Ccc = function Ccc() {
  const count = useContext(contextValue)
  return <div>
    Ccc值: {count}
  </div>
}

export default Aaa